<template>
  <div>
     <el-row :gutter="10">
        <el-col :span="6"><el-card>
        <div class="svg">
            <img src="@/assets/svg/1.svg" alt="" width="100px" height="100px">
            <div class="svg-content">
              <p class="svg-title">用户数</p>
              <p>{{four.userNum}}</p>
            </div>
        </div>
        </el-card>
        </el-col>
           <el-col :span="6"><el-card>
           <div class="svg">
            <img src="@/assets/svg/3.svg" alt="" width="100px" height="100px">
            <div class="svg-content">
              <p class="svg-title">管理员</p></p>
              <p>{{four.adminNum}}</p>
            </div>
        </div>
        </el-card>
        </el-col>
         <el-col :span="6"><el-card>
           <div class="svg">
            <img src="@/assets/svg/4.svg" alt="" width="100px" height="100px">
            <div class="svg-content">
              <p class="svg-title">博客数</p>
              <p>{{four.blogNum}}</p>
            </div>
        </div>
        </el-card>
        </el-col>
         <el-col :span="6"><el-card>
           <div class="svg">
            <img src="@/assets/svg/2.svg" alt="" width="100px" height="100px">
            <div class="svg-content">
              <p class="svg-title">待审核数</p>
              <p>{{four.awaitBlogNum}}</p>
            </div>
        </div>
        </el-card>
        </el-col>
      
</el-row>
    <Sale></Sale>
    <Buttom></Buttom>
  </div>
</template>

<script>
import Sale from "./Sale"
import Buttom from "./Buttom"
export default {
  name:"",
  components:{
    Sale,
    Buttom
  },
  data() {
    return {
      four:{}
    }
  },
  mounted() {
    this.getfour()
  },
  methods: {
    async getfour(){
      let result=await this.$API.echarts.getfour()
      console.log(result);
      if(result.code==200){
        this.four=result.data
        // console.log(this.four);
      }
    }
  },
 
}
</script>

<style  scoped>

.svg{
 display: flex;
 justify-content: space-between;
}

.svg-content{
  flex: 1;
  text-align: center;
}

.svg-title{
  font-size: 20px;
  font-weight:bold
}
</style>